<template>
  <div>
    <el-form ref="pram" :model="pram" :rules="rules" label-width="120px" @submit.native.prevent>
      <el-form-item label="配偶姓名" prop="spouseName">
        <el-input v-model="pram.spouseName" maxlength="20" placeholder="配偶姓名" />
      </el-form-item>
      <el-form-item label="户籍" prop="registeredResidence">
        <el-input v-model="pram.registeredResidence" maxlength="20" placeholder="户籍" />
      </el-form-item>
      <el-form-item label="公民身份证号码" prop="citizenIdNumber2">
        <el-input v-model="pram.citizenIdNumber2" maxlength="20" placeholder="公民身份证号码" />
      </el-form-item>
      <el-form-item label="公民身份证号码" prop="citizenIdNumber3">
        <el-input v-model.number="pram.citizenIdNumber3" placeholder="公民身份证号码" />
      </el-form-item>
      <el-form-item label="结婚日期" prop="marriageDate">
        <el-input v-model.number="pram.marriageDate" placeholder="结婚日期" />
      </el-form-item>
      <el-form-item label="失业时间" prop="unemploymentTime">
        <el-input v-model.number="pram.unemploymentTime" placeholder="失业时间" />
      </el-form-item>
      <el-form-item label="接触时间" prop="contactTime">
        <el-input v-model.number="pram.contactTime" placeholder="接触时间" />
      </el-form-item>
      <el-form-item label="备注" prop="remarks">
        <el-input v-model.number="pram.remarks" placeholder="备注" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="handlerSubmit('pram')">确定</el-button>
        <el-button @click="close">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import {Debounce} from '@/utils/validate'
import { randomString } from '@/utils/utils'
export default {
  components: { },
  props: {
    isCreate: {
      type: Number,
      required: true
    },
    editData: {
      type: Object,
      default: () => {
        return { rules: [] }
      }
    },
  },
  emits:['educationFee','hideEditDialog'],
  data() {
    return {
      constants:this.$constants,
      pram: {
        id:null,
        spouseName:'',
        registeredResidence:'',
        citizenIdNumber2:'',
        citizenIdNumber3:'',
        marriageDate:'',
        unemploymentTime:'',
        contactTime:'',
        remarks:'',
      },
      // rules: {
      //   spouseName: [{ required: true, message: '请填子女姓名', trigger: ['blur', 'change'] }],
      //   registeredResidence: [{ required: true, message: '请填身份证号', trigger: ['blur', 'change'] }],
      //   citizenIdNumber2: [{ required: true, message: '请填出生年月', trigger: ['blur', 'change'] }],
      //   citizenIdNumber3: [{ required: true, message: '请填年龄', trigger: ['blur', 'change'] }],
      // },
    }
  },
  mounted() {
    this.initEditData()
  },
  methods: {
    close() {
      this.$emit('hideEditDialog')
    },
    initEditData() {
      if (this.isCreate !== 1){
        this.pram.id=randomString(32)
        return
      }
      const { id,spouseName,registeredResidence,citizenIdNumber2,citizenIdNumber3,marriageDate,unemploymentTime,contactTime,remarks } = this.editData
      this.pram.id = id
      this.pram.spouseName = spouseName
      this.pram.registeredResidence = registeredResidence
      this.pram.citizenIdNumber2 = citizenIdNumber2
      this.pram.citizenIdNumber3 = citizenIdNumber3
      this.pram.marriageDate = marriageDate
      this.pram.unemploymentTime = unemploymentTime
      this.pram.contactTime = contactTime
      this.pram.remarks = remarks
    },

    handlerSubmit:Debounce(function(form) {
      this.$refs[form].validate(valid => {
        if (!valid) return
        this.$emit('educationFee',this.pram);
        this.close();
      })
    }),
  }
}
</script>

<style scoped>

</style>
